<template>
	<view class="contract" >
		<!-- 策略库 -->
		<!-- <view v-for="(items,indexs) in mend" :key="indexs" v-if="cindex=='0'"> -->
			<view style="margin-bottom: 20rpx;">
				<view class="contract-center" v-for="(item,index) in list" :key="index" @tap="trigger">
					
					<view class="center">
						<view class="center2-item1">
							{{item.name}}
							<!-- <text>{{item.num}}</text> -->
						</view>
						<view class="center2-item2">
							{{item.center}}
						</view>
					</view>
					<view class="center" style="text-align: right;font-weight: bold;">
						<view class="center2-item1 color-fall">
							+408.8%
						</view>
						<view class="center2-item2">
							年化收益率
						</view>
					</view>
				</view>
			</view>
		<u-loadmore :status="gloading" />
		<hide v-if="list.length=='0'"/>
	</view>
</template>

<script>
	export default {
		name:"contract",
		data() {
			return {
				// 内容
				list:[
					{
						name:'网格交易',
						num:'V2JHYJ',
						center:'网格交易的和约版本，放大本金，加上杠杆,分仓套利'
					},
					{
						name:'马丁追踪',
						num:'V2JHYJ',
						center:'马丁追踪与趋势追踪结合的交易模型，加上杠杆，倍投利器，马丁追踪与趋势追踪结合的交易模型'
					}
					
				],
				// gloading:'loadmore'
			};
		},
		props:{
			gloading:{
				type:String
			}
		},
		methods:{
			trigger(){
				this.$Router.push({ path: '/pages/transaction/contract-detils'})
			}
		}
	}
</script>

<style lang="scss">
	$radio:12rpx;
	$color-opact: $color-fu;
	.contract{
		padding: 50rpx 0rpx;
		// border: 1px solid red;
	}
.contract-center{
	@include flex;
	background-image: url(../../../static/goods.png);
	@include background;
	padding: 40rpx;
	margin-top: 30rpx;
	.center:nth-child(1){
		width: 70%;
	}
	.center:nth-child(2){
		width: 30%;
	}
	.center{
		
		.center2-item1{
			font-size: 30rpx;
			line-height: 60rpx;
			text{
				padding: 20rpx;
				color: $color-opact;
				font-size: 24rpx;
			}
		}
		.center2-item2{
			color: $color-opact;
			font-size: 24rpx;
			line-height: 35rpx;
			font-weight: 100;
			 text-overflow: -o-ellipsis-lastline;
			  overflow: hidden;
			  text-overflow: ellipsis;
			  display: -webkit-box;
			  -webkit-line-clamp: 2;
			  line-clamp: 2;
			  -webkit-box-orient: vertical;
		}
	}
}
</style>
